<!--
 * @Descripttion: 
 * @version: 
 * @Author: wutao
 * @LastEditors: wutao
 * @LastEditTime: 2025-08-22 15:45:52
-->
<template>
  <div>
    <!-- <div class="top_hytitle" style="margin-top: 0;">
                <div class="letf_line"></div>
                <div class="center_text">欢迎回来</div>
                <div class="right_line"></div>
              </div> -->
    <div class="">
      <p style="margin: 15px 0; color: #9998a9">
        {{ formatTimestamp(topList.createTime) }}
      </p>

      <div class="top-box" :class="isShadow?'boxShadow':''">
        <p v-if="topList.title">
          <span>{{ topList.title.split("：")[0] }}：</span>
          <span style="font-weight: bold">{{
            topList.title.split("：")[1]
          }}</span>
        </p>
        <div class="top-box-list" style="background: linear-gradient(180deg, rgba(8,131,241,0.028) 0%, rgba(8,131,241,0.012) 100%);border: 1px solid rgba(8,131,241,0.08);">
          <div class="">
            <div
              style="
                margin-bottom: 12px;
                line-height: 26px;
                text-align: justify;
                text-justify: inter-ideograph;
              "
              v-for="(topItemCard, topItemIndex) in topList.card"
              :key="topItemIndex"
            >
              <p v-if="topItemCard.name" style="margin-bottom: 10px">
                <span style="font-weight: bold">
                  {{ topItemCard.name.split("：")[0] }}：
                </span>
                <span>
                  {{ topItemCard.name.split("：")[1] }}
                </span>
              </p>

              <p v-if="topItemCard.sub">
                <span style="font-weight: bold">
                  {{ topItemCard.sub.split("：")[0] }}：
                </span>
                <span>
                  {{ topItemCard.sub.split("：")[1] }}
                </span>
              </p>
            </div>
          </div>
        </div>
        <div class="cn-dz">
          <div
            v-for="(item, index) in topList.linkUrl"
            :key="index"
            @click="gotodetails(item)"
          >
            <img
              src="../../assets//iconIndex/xgclclxg_icon.png"
              v-if="index == 0"
              alt=""
            /><img
              v-if="index == 1"
              src="../../assets//iconIndex/xgcldzcl_icon.png"
              alt=""
            />
            {{ item.name }}
          </div>
        </div>
        <div class="top-box-btn" @click="djrbseechance">去查看策略详情</div>
        <p class="askMe">你可以尝试这样问我</p>
        <div
          @click="sendMessageBy(topItemLink)"
          v-for="(topItemLink, topItemLinkIndex) in topList.link"
          class="top-box-list-item-link"
          :key="topItemLinkIndex"
        >
          {{ topItemLink }}
        </div>
      </div>
    </div>
  </div>
</template>
  
  <script>
import {} from "@/utils/common";
import { Toast } from "vant";
import commonFunc from "@/utils/ysjh";
import Index from "../parentsBox/index.vue";
export default {
  data() {
    return {};
  },
  props: {
    topList: {
      type: Object,
      default: () => {},
    },isShadow: {
    type: Boolean,
    default: false,
  },
  },
  watch: {},
  mounted() {},
  created() {},
  methods: {
    gotodetails(item) {
      console.log(item, "itme");
      let openSource = item.url.openSource;
      let openType = item.url.openType;
      let functionCode = item.url.functionCode;
      let param = item.url.param;
      commonFunc.openService(openSource, openType, functionCode, param);
    },
    sendMessageBy(e) {
      this.$parent.showCollect = false;
      this.$parent.someMethod(e);
    },
    djrbseechance() {
      let openSource = this.topList.url.openSource;
      let openType = this.topList.url.openType;
      let functionCode = this.topList.url.functionCode;
      let param = this.topList.url.param;
      commonFunc.openService(openSource, openType, functionCode, param);
    },
    formatTimestamp(ms) {
      if (!ms) {
        return "";
      }
      const time = Number(ms);
      if (!time || isNaN(time)) return "-";
      const d = new Date(time);
      const Y = d.getFullYear();
      const M = String(d.getMonth() + 1).padStart(2, "0");
      const D = String(d.getDate()).padStart(2, "0");
      const h = String(d.getHours()).padStart(2, "0");
      const m = String(d.getMinutes()).padStart(2, "0");
      const s = String(d.getSeconds()).padStart(2, "0");
      return `${Y}-${M}-${D} ${h}:${m}:${s}`;
    },
  },
};
</script>
  
  <style lang="less" scoped>
.ztfx-span {
  opacity: 1;
  color: #666666 !important;
  font-family: PingFang SC;
  font-weight: regular;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: 0px;
  text-align: justified;
  background: none !important;
  font-weight: normal !important;
}

.top-box-list-item-border {
  // border-bottom: 1px solid #aecde8;
}

.top-box-list {
  padding-bottom: 1px !important;
}

.gzlc_box {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 70px;
  height: 32px;
  background: url("@/assets/images/gzlc_box.png") no-repeat center center;
  background-size: 100% 100%;
  margin-top: 5px;
  font-size: 13px;
  font-family: PingFang SC-Medium, PingFang SC;
  font-weight: normal;
  color: #232428;
  margin-bottom: 10px;

  img {
    width: 10px;
    height: 10px;
    margin-right: 5px;
    vertical-align: middle;
  }
}
.cn-dz {
  display: flex;
  justify-content: start;
}
.cn-dz div {
  // width: 97px;
  border-radius: 8px;
  padding-left: 10px;
  padding-right: 8px;
  height: 36px;
  background: linear-gradient(to right, #d5edfd, #edecfd);
  background-size: 100% 100%;
  display: flex;
  align-items: center;
  // justify-content: center;

  margin-top: 12px;
  color: #333333;
  font-family: PingFang SC;
  font-weight: 500;
  font-size: 13px;
}
 .cn-dz div:nth-child(1) {
    margin-right: 8px;
  }
.cn-dz div img {
  width: 14px;
  height: 14px;
  margin-right: 4px;
}
</style>